@extends('admin.common.base-master')

@section('html-head')
    <link href="{{url('css/admin/pagenum.css')}}" rel="stylesheet" />
    <link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css">
    <script type="text/javascript" src="//code.jquery.com/ui/1.9.1/jquery-ui.min.js"></script>

    <link href="{{url('js/lib/jquery-ui-timepicker-addon.css')}}" type="text/css" />
    <script src="{{url('js/lib/jquery-ui-timepicker-addon.js')}}" type="text/javascript"></script>
    <script src="{{url('js/lib/jquery.ui.datepicker-zh-CN.js')}}" type="text/javascript"></script>
    <script src="{{url('js/lib/jquery-ui-timepicker-zh-CN.js')}}" type="text/javascript"></script>

    <script src="{{url('js/lib/distpicker.data.js')}}" type="text/javascript"></script>
    <script src="{{url("js/lib/distpicker.js")}}" type="text/javascript"></script>
    <style>
        .sx{padding: 10px}
        .sx-btn{width: 64px;height: 30px;background-color: #4dbcd3;color: #fff;border: #4dbcd3;border-radius: 7%;}
        .autocomplete-button{
            display: none;
        }
        .proposal-list li{
            background-color: white !important;
        }
        li.proposal.selected{
            background-color: rgb(175, 42, 0) !important;
        }
    </style>
@endsection

@section('html-body')
    <!-- content start -->
    <div id="content">
        <!-- cur-position start -->
        <div id="cur-position">
            <span class="tit">当前位置：</span>
            <a href="#">用户管理</a>
        </div>

        <!-- cur-position end -->
        <div class="filter-box clearfix">
            <div class="fl" style="display: inline-flex">
                <div class="sx">
                    <span>搜索会员：</span>
                    <input class="gg-ipt" style="width: 180px;height: 26px" type="text" placeholder="请输入昵称/手机号/真实姓名进行搜索" name="username" id="keyword" value="{{$keyword}}" />
                </div>
                <div class="sx">
                    <button class="sx-btn" id="sx_btn_seach">搜索</button>
                </div>
            </div>
            <div class="fl" style="display: inline-flex">
                <div class="sx">
                    <span>会员获取时间：</span>
                    <input class="gg-ipt" style="width: 180px;height: 26px" placeholder="请选择开始时间" name="the_time" id="start_time" value="{{$start_time}}" />-
                    <input class="gg-ipt" style="width: 180px;height: 26px" placeholder="请选择结束时间" name="end_time" id="end_time" value="{{$end_time}}" />
                </div>

                <div class="sx">
                    <div class="control-group">
                        <div class="controls" id="distpicker">
                            <span>筛选地区：</span>
                            <select tabindex="1" data-placeholder="Select here.." id="province"  selected class="span8" style="height: 30px;">
                                <option value="{{$province}}"  selected ></option></select>
                            <select tabindex="1" data-placeholder="Select here.." id="city"    selected    class="span8" style="height: 30px;">
                                <option value="{{$city}}"  selected ></option></select>
                        </div>
                    </div>
                </div>

                <div class="sx">
                    <button class="sx-btn" id="sx_btn">筛选</button>
                </div>
                <div class="sx">
                    <button class="sx-btn" id="download_btn" style="width: 100px">下载报表</button>
                </div>
            </div>
        </div>

        <!-- cur-position end -->
        <h3 class="zb-head">总计</h3>
        <div class="table-box">
            <table class="table">
                <thead>
                <tr>
                    <th>总会员数</th>
                    <th>今日新增会员</th>
                </tr>
                </thead>
                <tbody class="tbody-trend">
                <tr>
                    <td style="height: 25px">
                        <span class="head">{{$vip_count}}</span>
                    </td>
                    <td style="height: 25px">
                        <span class="head">{{$today_new_vip_count}}</span>
                    </td>
                </tr>
                </tbody>
            </table>
        </div>


        <div class="filter-box clearfix">

            <div class="fr">
                <a class="addBtn" href="{{route('Admin.Home.userSet')}}">新增</a>
            </div>
        </div>
        <div class="table-box">
            <table class="table">
                <thead>
                <tr>
                    <th>ID</th>
                    <th>手机号</th>
                    <th>创建时间</th>
                    <th>真实姓名</th>
                    <th>昵称</th>
                    <th>地区</th>
                    <th>会员来源</th>
                    {{--<th>操作</th>--}}
                </tr>
                </thead>
                <tbody id="fansinfo">
                @if(count($vips) > 0)
                    @foreach($vips as $vip)
                        @if(count($vip->vip_infos) > 0)
                        @foreach($vip->vip_infos as $key=>$vip_info)
                        <tr id="user_{{$vip->id}}">
                            @if($key == 0)
                            <td rowspan="{{count($vip->vip_infos)}}">{{$vip->id}}</td>
                            <td rowspan="{{count($vip->vip_infos)}}">{{$vip->phone}}</td>
                            <td rowspan="{{count($vip->vip_infos)}}">{{$vip->reg_time}}</td>
                            <td>{{$vip_info->realname}}</td>
                            <td>{{$vip_info->nickname}}</td>
                            <td>{{$vip_info->province}}{{$vip_info->city}}{{$vip_info->area}}</td>
                            <td>
                                @if($vip->from_type == 'admin_add')
                                    <span class="color4">人工新增</span>
                                @elseif($vip->from_type == 'tmall')
                                    <span class="color4">天猫</span>
                                @elseif($vip->from_type == 'user_add')
                                    <span class="color4">用户填写</span>
                                @elseif($vip->from_type == 'jd')
                                    <span class="color4">京东</span>
                                @endif
                            </td>
                            @else
                                <td>{{$vip_info->realname}}</td>
                                <td>{{$vip_info->nickname}}</td>
                                <td>{{$vip_info->province}}{{$vip_info->city}}{{$vip_info->area}}</td>
                                <td>
                                    @if($vip->from_type == 'admin_add')
                                        <span class="color4">人工新增</span>
                                    @elseif($vip->from_type == 'tmall')
                                        <span class="color4">天猫</span>
                                    @elseif($vip->from_type == 'user_add')
                                        <span class="color4">用户填写</span>
                                    @elseif($vip->from_type == 'jd')
                                        <span class="color4">京东</span>
                                    @endif
                                </td>

                                @endif
                                </tr>

                            {{--<td>--}}
                            {{--@if($user->role==1)--}}
                            {{--<a href="javascript:void(0);" class="del"  style="color: red" data-id="{{$user->id}}"> 删除</a>--}}
                            {{--@else--}}
                            {{------}}
                            {{--@endif--}}
                            {{--</td>--}}

                            @endforeach
                        @endif
                    @endforeach
                @endif
                </tbody>
            </table>
            <?php echo $vips->appends(['keyword' =>$keyword,"start_time"=>$start_time,"end_time"=>$end_time,"province"=>$province,"city"=>$city])->render(); ?>
        </div>
    </div>
    <!-- content end -->
    <script>
        $(function(){
            var pp     = $('#province').val();
            var cc     = $('#city').val();
            var aa     = $('#area').val();

            $('#distpicker').distpicker({
                province: pp,
                city: cc,
                district: aa
            });

            jQuery('#start_time').datetimepicker({
                timeFormat: "HH:mm:ss",
                dateFormat: "yy-mm-dd",
                beforeShow: function () {
                    setTimeout(
                        function () {
                            $('#ui-datepicker-div').css("z-index", 1000);
                        }, 100
                    );
                }
            });

            jQuery('#end_time').datetimepicker({
                timeFormat: "HH:mm:ss",
                dateFormat: "yy-mm-dd",
                beforeShow: function () {
                    setTimeout(
                        function () {
                            $('#ui-datepicker-div').css("z-index", 1000);
                        }, 100
                    );
                }
            });

            $(document).on("click","#sx_btn_seach",function(){
                var keyword = $("#keyword").val();
                window.location.href="{{route('Admin.Home.vipList')}}?keyword="+keyword;
            });

            $(document).on("click","#sx_btn",function(){
                var startTime = $("#start_time").val();
                var endTime   = $("#end_time").val();
                var province  = $("#province").val();
                var city      = $("#city").val();
                window.location.href="{{route('Admin.Home.vipList')}}?start_time="+startTime+"&end_time="+endTime+"&province="+province+"&city="+city;
            });

            $(document).on("click",".del",function(){
                var id = $(this).attr("data-id");

                noty({
                    text: '你确定要删除吗?',
                    buttons: [
                        {addClass: 'btn btn-primary', text: '确定', onClick: function($noty) {
                                $noty.close();
                                $.ajax({
                                    url:'{{route('Api.Admin.sys.delUser')}}',
                                    type:'post',
                                    dataType:'json',
                                    data:{id:id},
                                    success:function(obj){
                                        if(obj.level == "success"){
                                            $("#user_"+id).hide('slow');
                                        }else{
                                            noty({type:obj.level,text:obj.message,timeout:600});
                                        }
                                    },
                                    error:function(obj){
                                        console.log(obj);
                                    }

                                });
                            }
                        },
                        {addClass: 'btn btn-danger', text: '取消', onClick: function($noty) {
                                $noty.close();
                            }
                        }
                    ]
                });

            });
        });
    </script>
@endsection